﻿<!DOCTYPE html>
<html>
<head>
    <title>Crosshair (AJAX Event Calendar)</title>

        <!-- head -->
        <meta charset="utf-8"> 
        <!-- demo stylesheet -->
    	<link type="text/css" rel="stylesheet" href="../helpers/demo.css?v=174" />    
        <link type="text/css" rel="stylesheet" href="../helpers/media/layout.css?v=174" />    
        <link type="text/css" rel="stylesheet" href="../helpers/media/elements.css?v=174" />   

	<!-- helper libraries -->
	<script src="../helpers/jquery-1.9.1.min.js" type="text/javascript"></script>
    
	<!-- daypilot libraries -->
        <script src="../js/daypilot-all.min.js?v=174" type="text/javascript"></script>

        <!-- daypilot themes -->
	<link type="text/css" rel="stylesheet" href="../themes/month_white.css?v=174" />
	<link type="text/css" rel="stylesheet" href="../themes/month_green.css?v=174" />    
	<link type="text/css" rel="stylesheet" href="../themes/month_transparent.css?v=174" />    
        
	<link type="text/css" rel="stylesheet" href="../themes/calendar_transparent.css?v=174" />    
	<link type="text/css" rel="stylesheet" href="../themes/calendar_white.css?v=174" />    
	<link type="text/css" rel="stylesheet" href="../themes/calendar_green.css?v=174" />    

	<link type="text/css" rel="stylesheet" href="../themes/navigator_green.css?v=174" />    
	<link type="text/css" rel="stylesheet" href="../themes/navigator_white.css?v=174" />    

	<!-- /head -->
       
</head>
<body>

<!-- top -->
        <div id="header">
			<div class="bg-help">
				<div class="inBox">
					<h1 id="logo"><a href='http://javascript.daypilot.org/'>DayPilot Lite for JavaScript</a> &raquo; <a href='http://javascript.daypilot.org/demo/lite/'>Demo</a></h1>
					<p id="claim">Open-Source AJAX Calendar/Scheduling Widgets for JavaScript/jQuery/HTML5.</p>
					<hr class="hidden" />
				</div>
			</div>
		</div>
		
    <div id="download">
            <div style="float:left; width: 130px;"><a href="http://javascript.daypilot.org/download/" class="css3button"><span>Download</span></a></div>
            <div style="margin-left: 130px;">
                <div><a href="http://javascript.daypilot.org/download/">Download</a> DayPilot Lite (open-source).</div>
                <div>See also the advanced features of <a href="http://javascript.daypilot.org/demo/">DayPilot Pro</a> (commercial).</div>
            </div>
        
    </div>

    <div id="main">
        <div id="tabs">
            <!-- tabs -->
<div>
<a class='tab' href='../index.html'><span style="width: 100px; text-align:center;">Home</span></a>
<a class='tab selected' href='../calendar/index.html'><span style="width: 100px; text-align:center;">Calendar</span></a>
<a class='tab' href='../month/index.html'><span style="width: 100px; text-align:center;">Month</span></a>
<a class='tab' href='../scheduler/index.html'><span style="width: 100px; text-align:center;">Scheduler</span></a>
</div>
<div class="header"><div class="bg-help">Outlook-Like Day/Week View. Customizable Columns.</div></div>

            <!-- /tabs -->
        </div>
        
        <div id="container" >
	        <div id="left" class="menu">
		    	            <div>
                        <!-- menu -->
<div class="header">Main</div>
<div>
  <a href='index.html'><span>JavaScript Event Calendar</span></a>
</div>
<div class="header">Navigation</div>
<div>
  <a href='navigator.html'><span>Navigator</span></a>
</div>
<div>
  <a href='datepicker.html'><span>Date Picker</span></a>
</div>
<div>
  <a href='nextprevious.html'><span>Next/Previous</span></a>
</div>
<div class="header">Themes</div>
<div>
  <a href='themegreen.html'><span>Green</span></a>
</div>
<div>
  <a href='themetransparent.html'><span>Transparent</span></a>
</div>
<div>
  <a href='themewhite.html'><span>White</span></a>
</div>
<div class="header">Events</div>
<div>
  <a href='allday.html'><span>All-Day Events</span> <span class="pro">PRO</span></a>
</div>
<div>
  <a href='eventareas.html'><span>Active Areas</span> <span class="pro">PRO</span></a>
</div>
<div>
  <a href='eventmenu.html'><span>Context Menu</span> <span class="pro">PRO</span></a>
</div>
<div>
  <a href='eventselecting.html'><span>Event Selecting</span> <span class="pro">PRO</span></a>
</div>
<div>
  <a href='eventcustomization.html'><span>Event Customization</span> <span class="pro">PRO</span></a>
</div>
<div class="header">Grid</div>
<div>
  <a href='50columns.html'><span>50 columns</span> <span class="pro">PRO</span></a>
</div>
<div>
  <a href='100pctheight.html'><span>100% height</span> <span class="pro">PRO</span></a>
</div>
<div>
  <a href='crosshair.html'><span>Crosshair</span> <span class="pro">PRO</span></a>
</div>
<div class="header">API</div>
<div>
  <a href='angularjs.html'><span>AngularJS</span> <span class="new">NEW</span></a>
</div>
<div class="header">Localization</div>
<div>
  <a href='localization.html'><span>Localization</span></a>
</div>
<div>
  <a href='rtl.html'><span>RTL</span> <span class="pro">PRO</span></a>
</div>
<div class="header">Timeline</div>
<div>
  <a href='overnight.html'><span>Overnight Shift</span> <span class="pro">PRO</span></a>
</div>
<div>
  <a href='lunchbreak.html'><span>Lunch Break</span> <span class="pro">PRO</span></a>
</div>
<div class="header">View Types</div>
<div>
  <a href='day.html'><span>Day View</span></a>
</div>
<div>
  <a href='week.html'><span>Week View</span></a>
</div>
<div>
  <a href='resources.html'><span>Resources</span> <span class="pro">PRO</span></a>
</div>
<div>
  <a href='hierarchy.html'><span>Resource Hierarchy</span> <span class="pro">PRO</span></a>
</div>

                        <!-- /menu -->
	    		            </div>
            </div>
	        <div id="content">
	            <div>
<!-- /top -->

<p>Crosshair is only supported in the Pro edition:</p>
<p><a href="http://javascript.daypilot.org/demo/calendar/crosshair.html">Crosshair</a></p>


<!-- bottom -->
                </div>
	        </div>
        </div>
    </div>
<script type="text/javascript">
$(document).ready(function() {
    var url = window.location.href;
    var filename = url.substring(url.lastIndexOf('/')+1);
    if (filename === "") filename = "index.html";
    $(".menu a[href='" + filename + "']").addClass("selected");
});
        
</script>
<!-- /bottom -->

</body>
</html>

